<template>
  <div class="app-container">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>车辆信息统计</span>
      </div>
      <div class="text">车辆总数：{{allCount.allBikeCount}}辆</div>
      <div class="text item">在库车辆：{{allCount.bikeBikeStock}}辆</div>
    </el-card>

    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>学生信息统计</span>
      </div>
      <div class="text">学生总数：{{allCount.studentCount}}人</div>
    </el-card>

    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>管理员信息统计</span>
      </div>
      <div class="text">管理员总数：{{allCount.adminCount}}人</div>
    </el-card>

    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>租赁信息统计</span>
      </div>
      <div class="text">租赁次数总数：{{allCount.rentCount}}次</div>
      <div class="text item">押金总金额：¥{{allCount.rentAntecedentCount}}</div>
      <div class="text item">租赁总金额：¥{{allCount.rentAmountCount}}</div>

    </el-card>
  </div>
</template>

<script>
import {
  statistics
} from "@/api/rent";
export default {
  name: "home",

  data() {
    return {
      allCount:{}
    };
  },

  created() {
    this.allStatistics();
  },

  methods: {
    allStatistics(){
      statistics().then((response)=>{
        this.allCount = response.data
      })
    }
  },
};
</script>

<style lang="scss" scoped>
.app-container {
  padding: 20px;
  .el-card {
    margin-top: 20px;
    .item{
      margin-top: 10px;
    }
  }
  span {
    margin-right: 20px;
  }
}
</style>
